<template>
  <div class="layout">
    <nav>
      <top-nav></top-nav>
    </nav>
    <header>
      <top-header></top-header>
    </header>
    <top-header-sticky></top-header-sticky>
    <!-- 内容 -->
    <div class="main">
      <router-view></router-view>
    </div>
    <footer>
      <footer-content></footer-content>
    </footer>
  </div>
</template>

<script>
  import {
    useStore
  } from "vuex";
  import TopHeader from "../components/content/TopHeader.vue";
  import TopHeaderSticky from "../components/content/TopHeaderSticky.vue";
  import TopNav from "../components/content/TopNav.vue";
  import FooterContent from "../components/content/FooterContent.vue";
  export default {
    name: "Layout",
    components: {
      TopNav,
      TopHeader,
      FooterContent,
      TopHeaderSticky,
    },
    setup() {
      const store = useStore();
      store.dispatch("catagory/getCatagory");
    },
  };

</script>

<style lang="less" scoped>
</style>
